<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>品优购</title>
    <link rel="shortcut icon" href="favicon.ico">
    <link rel="stylesheet" href="css\base.css">
    <link rel="stylesheet" href="css\common.css">
    <link rel="stylesheet" href="./fonts/iconfont.css">
    <link rel="stylesheet" href="css\index.css">
</head>
<body>
    <!-- shortcut部分开始 -->
    <div class="shortcut">
        <div class="w">
           <div class="fl">
            <ul>
                <li><a href="#">品优购欢迎您！</a></li>
                <li><a href="#">请登录</a></li>
                <li><a href="#" class="red">免费注册</a></li>
            </ul>
           </div>
           <div class="fr">
               <ul>
                   <li><a href="#">
                       我的订单
                       <span class="iconfont iconxiajiantou"></span>
                   </a></li>
                   <li class="line">|</li>
                   <li><a href="#">
                       我的品优购
                   </a></li>
                   <li class="line">|</li>
                   <li><a href="#">
                       品优购会员
                   </a></li>
                   <li class="line">|</li>
                   <li><a href="#">
                       企业采购
                   </a></li>
                   <li class="line">|</li>
                   <li><a href="#">
                       关注品优购
                       <span class="iconfont iconxiajiantou"></span>
                   </a></li>
                   <li class="line">|</li>
                   <li><a href="#">
                       客户服务
                       <span class="iconfont iconxiajiantou"></span>
                   </a></li>
                   <li class="line">|</li>
                   <li><a href="#">
                       网站导航
                       <span class="iconfont iconxiajiantou"></span>
                   </a></li>
               </ul>
           </div>
        </div>
    </div>
    <!-- shortcut部分结束 -->
    <!-- header部分开始 -->
    <header class="header w">
       <div class="logo">
        <h1>
            <a href="index.html" title="品优购商城">品优购商城</a>
        </h1>
       </div>
       <!-- logo部分结束 -->
       <div class="search">
           <input type="search" placeholder="语言开发"><button>搜索</button><span class="iconfont iconzhaoxiangji"></span>
       </div>
       <!-- search部分结束 -->
       <div class="hotwords">
           <a href="#" class="red">优惠购首发</a>
           <a href="#">亿元优惠</a>
           <a href="#">9.9元团购</a>
           <a href="#">美满99减30</a>
           <a href="#">办公用品</a>
           <a href="#">电脑</a>
           <a href="#">通信</a>
       </div>
       <!-- hotwords部分结束 -->
       <div class="shopcar">
        <span class="iconfont icongouwuchekong"></span>
        <span>我的购物车</span>
        <span class="iconfont iconiconfontjiantou3"></span>
        <i class="count">8</i>
       </div>
       <!-- shopcar部分结束 -->
    </header>
    <!-- header部分结束 -->
    <!-- nav部分开始 -->
    <div class="nav ">
       <div class="w">
        <div class="dropdown">
            <div class="qbsp">全部商品分类</div>
            <div class="dd">
               <ul>
                   <li><a href="#">家用电器<span class="iconfont iconiconfontjiantou3"></span></a></li>
                   <li><a href="#">手机、 数码、通信<span class="iconfont iconiconfontjiantou3"></span></a></li>
                   <li><a href="#">电脑、办公<span class="iconfont iconiconfontjiantou3"></span></a></li>
                   <li><a href="#">家居、家具、家装、厨具<span class="iconfont iconiconfontjiantou3"></span></a></li>
                   <li><a href="#">男装、女装、童装、内衣<span class="iconfont iconiconfontjiantou3"></span></a></li>
                   <li><a href="#">个户化妆、清洁用品、宠物<span class="iconfont iconiconfontjiantou3"></span></a></li>
                   <li><a href="#">鞋靴、箱包、珠宝、奢侈品<span class="iconfont iconiconfontjiantou3"></span></a></li>
                   <li><a href="#">运动户外、钟表<span class="iconfont iconiconfontjiantou3"></span></a></li>
                   <li><a href="#">汽车、汽车用品<span class="iconfont iconiconfontjiantou3"></span></a></li>
                   <li><a href="#">母婴、玩具乐器<span class="iconfont iconiconfontjiantou3"></span></a></li>
                   <li><a href="#">食品、酒类、生鲜、特产<span class="iconfont iconiconfontjiantou3"></span></a></li>
                   <li><a href="#">医药保健<span class="iconfont iconiconfontjiantou3"></span></a></li>
                   <li><a href="#">图书、音像、电子书<span class="iconfont iconiconfontjiantou3"></span></a></li>
                   <li><a href="#">彩票、旅行、充值、票务<span class="iconfont iconiconfontjiantou3"></span></a></li>
                   <li><a href="#">理财、众筹、白条、保险<span class="iconfont iconiconfontjiantou3"></span></a></li>
               </ul>
            </div>
        </div>
        <div class="navitems">
            <ul>
                <li><a href="#">服装城</a></li>
                <li><a href="#">美妆馆</a></li>
                <li><a href="#">传智超市</a></li>
                <li><a href="#">全球购</a></li>
                <li><a href="#">闪购</a></li>
                <li><a href="#">团购</a></li>
                <li><a href="#">拍卖</a></li>
                <li><a href="#">有趣</a></li>
            </ul>
        </div>
        <!-- .navitems部分结束 -->
       </div>
    </div>
    <!-- nav部分结束 -->
    <div class="w">
        <div class="main">
            <div class="focus">
                <img src="images\focus.png">
            </div>
            <div class="newsflash">
                <div class="news">
                    <div class="news-hd">
                        <h5>品优购快报</h5>
                        <a href="#">更多<span class="iconfont iconiconfontjiantou3"></span></a> 
                    </div>
                    <div class="news-bd">
                        <ul>
                            <li><a href="#"><strong>[特惠]</strong> 坚持不懈，方得始终</a></li>
                            <li><a href="#"><strong>[公告]</strong> 坚持不懈，方得始终</a></li>
                            <li><a href="#"><strong>[特惠]</strong> 坚持不懈，方得始终</a></li>
                            <li><a href="#"><strong>[公告]</strong> 坚持不懈，方得始终</a></li>
                            <li><a href="#"><strong>[特惠]</strong> 坚持不懈，方得始终</a></li>
                        </ul>
                    </div>
                </div>
                <div class="lifeservice">
                    <ul>
                        <li><i></i><p>话费</p></li>
                        <li><i></i><p>话费</p></li>
                        <li><i></i><p>话费</p></li>
                        <li><i></i><p>话费</p></li>
                        <li><i></i><p>话费</p></li>
                        <li><i></i><p>话费</p></li>
                        <li><i></i><p>话费</p></li>
                        <li><i></i><p>话费</p></li>
                        <li><i></i><p>话费</p></li>
                        <li><i></i><p>话费</p></li>
                        <li><i></i><p>话费</p></li>
                        <li><i></i><p>话费</p></li>
                    </ul>
                </div>
                <div class="bargain"><img src="uploads\bargain.png"></div>
            </div>
        </div>
    </div>
    <!-- main部分结束 -->

    <div class="recommend w">
        <div class="today">
            <span class="iconfont iconicon_shizhong-"></span>
            <p>今日推荐</p>
        </div>
        <div class="recommend-news">
            <ul>
                <li><img src="uploads\recom_03.jpg"></li>
                <li><img src="uploads\recom_03.jpg"></li>
                <li><img src="uploads\recom_03.jpg"></li>
                <li><img src="uploads\recom_03.jpg"></li>
            </ul>
        </div>
    </div>
    <!-- recommend部分结束 -->
    <!-- favorite部分开始 -->
    <div class="favorite w">
        <h4>猜你喜欢</h4>
        <div class="refresh">
            <a href="#">换一批 <span class="iconfont iconshuaxinzhongjieban"></span></a>
        </div>
        <div class="ad">
            <ul>
                <li><img src="uploads\like_01.png">
                <p>阳光美包新款单肩包女</p>
                <p>阳光美包新款单肩包女</p>
                <p>￥199</p>
                </li>
                <li><img src="uploads\like_01.png">
                <p>阳光美包新款单肩包女</p>
                <p>阳光美包新款单肩包女</p>
                <p>￥199</p></li>
                <li><img src="uploads\like_01.png">
                <p>阳光美包新款单肩包女</p>
                <p>阳光美包新款单肩包女</p>
                <p>￥199</p></li>
                <li><img src="uploads\like_01.png">
                <p>阳光美包新款单肩包女</p>
                <p>阳光美包新款单肩包女</p>
                <p>￥199</p></li>
                <li><img src="uploads\like_01.png">
                <p>阳光美包新款单肩包女</p>
                <p>阳光美包新款单肩包女</p>
                <p>￥199</p></li>
                <li><img src="uploads\like_01.png">
                <p>阳光美包新款单肩包女</p>
                <p>阳光美包新款单肩包女</p>
                <p>￥199</p></li>
            </ul>
        </div>
    </div>
    <!-- favorite部分结束 -->
    <!-- fun部分开始 -->
    <div class="fun w">
        <div class="fun_hd">传智播客•有趣区</div>
        <div class="fun_bd">
            <div class="w404 fl"><img src="uploads\interest01.png"></div>
            <div class="w227 fl">
                <h2>好东西</h2>
                <a href="javascript:;"><img src="uploads\interest02.png"></a>
                <a href="javascript:;"><img src="uploads\interest03.png"></a>
            </div>
            <div class="w406 fl">
                <h2>好东西</h2>
                
                <div class="second"><a href="javascript:;"><img src="uploads\interest04.png"></a></div>
                <div class="third">
                    <a href="javascript:;"><img src="uploads\interest05.png"></a>
                    <a href="javascript:;"><img src="uploads\interest06.png"></a></div>
            </div>
            <div class="w162 fl">
                <ul>
                    <li><img src="uploads/brand01.png" alt=""></li>
                    <li><img src="uploads/brand02.png" alt=""></li>
                    <li><img src="uploads/brand03.png" alt=""></li>
                    <li><img src="uploads/brand04.png" alt=""></li>
                    <li><img src="uploads/brand05.png" alt=""></li>
                    <li><img src="uploads/brand06.png" alt=""></li>
                    <li><img src="uploads/brand07.png" alt=""></li>
                    <li><img src="uploads/brand08.png" alt=""></li>
                    <li><img src="uploads/brand09.png" alt=""></li>
                    <li><img src="uploads/brand10.png" alt=""></li>
                    <li><img src="uploads/brand11.png" alt=""></li>
                    <li><img src="uploads/brand12.png" alt=""></li>
                    <li><img src="uploads/brand13.png" alt=""></li>
                    <li><img src="uploads/brand04.png" alt=""></li>
                </ul>
            </div>
        </div>

    </div>
    <!-- fun部分结束 -->
    <!-- jiadian部分开始 -->
    <div class="floor">
        <div class="jiadian w">
            <div class="jiadian_hd clearfix">
                <h4>家用电器</h4>
                <div class="table_list">
                    <ul>
                        <li><a href="#" class="red">热门</a><span>|</span></li>
                        <li><a href="#">大家电</a><span>|</span></li>
                        <li><a href="#">生活电器</a><span>|</span></li>
                        <li><a href="#">厨房电器</a><span>|</span></li>
                        <li><a href="#">个护健康</a><span>|</span></li>
                        <li><a href="#">应季电器</a><span>|</span></li>
                        <li><a href="#">空气/净水</a><span>|</span></li>
                        <li><a href="#">新奇特</a><span>|</span></li>
                        <li><a href="#">高端电器</a></li>
                    </ul>
                </div>
            </div>
            <div class="jiadian_bd">
               <div class="table_content .clearfix">
                <div class="w209 fl">
                    <div class="jiadian_tj">
                        <ul>
                            <li><a href="#">节能补贴</a></li>
                            <li><a href="#">智能电视</a></li>
                            <li><a href="#">空气净化器</a></li>
                            <li><a href="#">IH电饭煲</a></li>
                            <li><a href="#">滚筒洗衣机</a></li>
                            <li><a href="#">电热水器</a></li>
                        </ul>
                        
                    </div>
                    <img src="uploads\floor-1-1.png">
                </div>
                <div class="w329 fl">
                    <img src="./uploads/floor-1-b01.png">
                    <div class="foucs">
                        <ul>
                            <li></li>
                            <li></li>
                            <li></li>
                        </ul>
                    </div>
                </div>
                <div class="w220 fl">
                    <img src="uploads\floor-1-2.png">
                    <img src="uploads\floor-1-3.png">
                </div>
                <div class="w221 fl">
                    <img src="uploads\floor-1-4.png">
                </div>
                <div class="w221_two fl">
                    <img src="uploads\floor-1-5.png">
                    <img src="uploads\floor-1-6.png">
                </div>
               </div>
            </div>
            
        </div>
    </div>
    <!-- jiadian部分结束 -->
    <!-- footer部分开始 -->
    <div class="footer clearfix">
        <div class="service w">
            <ul>
                <li>
                    <div class="service_img"></div>
                    <h4>正品保障</h4>
                    <p>正品保障，提供发票</p>
                </li>
                <li><div class="service_img"></div>
                    <h4>正品保障</h4>
                    <p>正品保障，提供发票</p></li>
                <li><div class="service_img"></div>
                    <h4>正品保障</h4>
                    <p>正品保障，提供发票</p></li>
                <li><div class="service_img"></div>
                    <h4>正品保障</h4>
                    <p>正品保障，提供发票</p></li>
                <li><div class="service_img"></div>
                    <h4>正品保障</h4>
                    <p>正品保障，提供发票</p></li>
            </ul>
        </div>
        <div class="mod_help w">
            <div class="mod_help_div">
                <h4>购物指南</h4>
                <ul>
                    <li>购物流程</li>
                    <li>会员介绍</li>
                    <li>生活旅行/团购</li>
                    <li>常见问题</li>
                    <li>大家电</li>
                    <li>联系客服</li>
                </ul>
            </div>
            <div class="mod_help_div"><h4>购物指南</h4>
                <ul>
                    <li>购物流程</li>
                    <li>会员介绍</li>
                    <li>生活旅行/团购</li>
                    <li>常见问题</li>
                    <li>大家电</li>
                    <li>联系客服</li>
                </ul></div>
            <div class="mod_help_div"><h4>购物指南</h4>
                <ul>
                    <li>购物流程</li>
                    <li>会员介绍</li>
                    <li>生活旅行/团购</li>
                    <li>常见问题</li>
                    <li>大家电</li>
                    <li>联系客服</li>
                </ul></div>
            <div class="mod_help_div"><h4>购物指南</h4>
                <ul>
                    <li>购物流程</li>
                    <li>会员介绍</li>
                    <li>生活旅行/团购</li>
                    <li>常见问题</li>
                    <li>大家电</li>
                    <li>联系客服</li>
                </ul></div>
            <div class="mod_help_div"><h4>购物指南</h4>
                <ul>
                    <li>购物流程</li>
                    <li>会员介绍</li>
                    <li>生活旅行/团购</li>
                    <li>常见问题</li>
                    <li>大家电</li>
                    <li>联系客服</li>
                </ul></div>
            <div class="mod_help_div">
                <h4>帮助中心</h4>
                <div class="two-bar-codes"></div>
                <p>品优购客户端</p>
            </div>
        </div>
        <div class="aboutus w">
            <p>
                <a href="#">关于我们</a><span>|</span>
                <a href="#">关于我们</a><span>|</span>
                <a href="#">关于我们</a><span>|</span>
                <a href="#">关于我们</a><span>|</span>
                <a href="#">关于我们</a><span>|</span>
                <a href="#">关于我们</a><span>|</span>
                <a href="#">关于我们</a><span>|</span>
                <a href="#">关于我们</a><span>|</span>
                <a href="#">关于我们</a><span>|</span>
                <a href="#">关于我们</a><span>|</span>
                <a href="#">关于我们</a><span>|</span>
                <a href="#">关于我们</a>
            </p>
            <p class="address">地址：北京市昌平区建材城西路金燕龙办公楼一层 邮编：100096 电话：400-618-4000 传真：010-82935100 邮箱: zhanghj+itcast.cn</p>
            <p class="copyright">京ICP备08001421号京公网安备110108007702</p>
        </div>
    </div>
    <!-- footer部分结束 -->
</body>
</html>